<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文档服务</title>
    <link rel="stylesheet" href="/LhpDocs_static/xcode.css">
    <link rel="stylesheet" href="/LhpDocs_static/styles.css">
    <script src="/LhpDocs_static/vue2.6.14.js"></script>
    <script src="/LhpDocs_static/marked.js"></script>
    <script src="/LhpDocs_static/highlight.min.js"></script>

</head>
<body>
    <div id="app">
        <div class="container">
            <aside class="LhpDocs_sidebar" style="width:15%">
            </aside>
            <aside class="LhpDocs_sidebar" style="width:15%;position:fixed;height:100%;">
                <ul>
                    <li v-for="(firstLevel, firstKey) in categories" :key="firstKey" >
                        <span @click="selectCategory(firstKey)">{{ firstLevel.name }}</span>
                        <ul v-if="selectedCategory == firstKey">
                            <li v-for="(secondLevel, secondKey) in firstLevel.dict" :key="secondKey">
                                <a href="#" @click.prevent="selectDocument(firstKey, secondKey)" :class="{ 'LhpDocs_active_class': now_select_md_id == secondKey}">{{ secondLevel.name }}</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </aside>
            <main class="LhpDocs_content" style="width:85%;">
                <div v-html="compiledMarkdown" style="padding:30px"></div>
            </main>
        </div>
    </div>

    <script src="/LhpDocs_static/app.js"></script>
</body>
</html>
